<!--
 * @Descripttion: 
 * @version: 
 * @Author: weni09
 * @Date: 2021-04-19 14:07:39
 * @LastEditors: weni09
 * @LastEditTime: 2021-06-17 08:50:54
 * @FilePath: \icoder-frontend\blog\src\views\About.vue
-->
<template>
	<div class="about">
		<el-row class="archive-row" type="flex" justify="center">
		<el-col :span="18">
			<div class="about-edit" v-if="$store.getters.auth.user && $store.getters.auth.user.is_superuser"><router-link to="/about/edit" class="about-router">编辑</router-link></div>
			<div class="about-content markdown-body" v-html="content" v-highlight></div>
		</el-col>
		</el-row>
	</div>
</template>

<script>
import {fetchAbout} from 'api';

	export default {
		name: 'about',
		data() {
			return {
				content:""
			};
		},
		methods:{
			queryAbout(){
			let params={id:1}
			fetchAbout(params).then(res=>{
				this.content = res.data.content
			}).catch(err=>{
				console.log("queryAbout: ",err)
			})

			}
		},
		updated(){
			//数据获取，被渲染后，操作dom,执行添加行号
			//注:渲染后才能操作dom
			window.hljsln.initLineNumbersOnLoad();
		},
		mounted(){
			this.queryAbout();
		}

	}
</script>

<style scoped>
.about-edit{
	text-align: right;
}
.about-router {
text-decoration:none;
font-size: 0.9rem;
color:#6a737d;
}
.about-router:hover{
	color: #4285f4;
}

</style>